<template>
    <div class="page-type-box">
        <!-- <span class="spanbutton">将H5APP页面地址同步到后台</span> -->
        <!-- <blue-btn :clickEvent="sevurldata" text="将H5APP页面地址同步到后台"></blue-btn> -->
        <span @click="sevurldata" class="spanbutton">将页面信息更新同步到后台</span>
       <m-toast ref="mToast"></m-toast>
    </div>
</template>
<script>
    import {mapGetters} from "vuex";
    import Toast from "../Toast";
    import axios from "axios";
    import BlueButton from "../BlueButton";
    import mergeRouter from "../../utils/settings/mergeRouter";
    export default {
        data() {
            return {
            	options: [],
                activityNameList: {},
                otherpagedata:[]
            }
        },
        computed: {
            ...mapGetters("cjy", [
                "classifyData"
            ]),
            getRouterKey() {
                return this.FirstCapital(window.environment) + window.environment.slice(1, window.environment.length) + "Router";
            },
            getClassifyData() {
                return this.classifyData;
            },
        },
        components: {
            "m-toast": Toast,
            "blue-btn": BlueButton
        },
        methods: {
        	//显示Toast的方法
			infoToast(msg) {
				this.$refs.mToast.toast(msg);
			},
			//数据处理
            FirstCapital(str) {
                return str.slice(0, 1).toUpperCase();
            },
            //初始化菜单
            async initOptions() {
                let opt = [
                    {
                        label: "其他页面",
                        value: "其他页面",
                        id: "other",
                        children: []
                    }
                ];
                //找到自定义的route
                let currentRouter = mergeRouter();
                //填充其他页面
                currentRouter.filter(item => {
                    return item.state === 1;
                }).forEach((item, index) => {
                    let obj = {
                        label: item.title ? item.title : item.name,
                        value: item.name 
                    }
                    this.getMenuItemById("other", opt).children.push(obj);
                });
                this.getMenuItemById("other", opt).children.push({
                    label: "专题活动模板",
                    value: "NewThematicActivities-专题活动模板"
                });
                this.options = opt;
                this.otherpagedata = this.options[0].children
            },
            //根据id获取options对应的菜单项
            getMenuItemById(id, opt = this.options) {
                //校验id值
                if (!id) {
                    console.log(console.warn("请传入id值"));
                    return;
                }
                for (let item of opt) {
                    if (item.id === id) {
                        return item;
                    }
                }
            },
            //点击按钮储存数据到后台
            sevurldata(){
                // console.log("========", this.otherpagedata);
                // return;
				let config = {
					url: api.base_host+'/templateConfig/pageContent',
					method: 'post',
					data:{
						pageContent:JSON.stringify(this.otherpagedata),
					},
					headers: {sessionId: getCookie("sessionId")}
				};
				axios(config).then(data => {
					if(data.data.returnCode===1){
                        
						this.infoToast("保存成功");
					}else{
						this.infoToast("保存失败")
					}
					
				})
            }
            
        },
        created() {
            this.initOptions();
        },
        
    }
</script>

<style scoped>
.spanbutton{
	/* display: inline-block;
    margin-right: 20px; */
    display: inline-block;
    height: 28px;
    border: 1px solid #3876ae;
    /* width: 70px; */
    font-size: 14px;
    background: #3876ae;
    color: #fff;
    line-height: 28px;
    border-radius: 3px;
    cursor: pointer;
    text-align: center;
    padding:0 4px;
}
</style>

